<%@ page contentType="text/html;charset=UTF-8"%>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<html>
<head>
<title>综合充值卡充值</title>
<meta name="decorator" content="default" />
<style type="text/css">
.form-horizontal .control-label {
	float: left;
	width: 80px;
	padding-top: 5px;
	text-align: right;
}

.form-horizontal .controls {
	*padding-right: 20px;
	*display: inline-block;
	margin-left: 100px;
	*margin-left: 0;
}

#productList {
	float: right;
	width: 78%;
	height: 300px;
	border: 1px solid #cccccc;
	display: block;
	overflow: auto;
	border-radius: 0;
}

#productList li a {
	border-color: #f3f3f3;
	background: #fff;
	color: #000;
}
</style>
<script type="text/javascript">
	$(document).ready(
			function() {
				$("#inputForm").validate(
						{
							submitHandler : function(form) {
								global.confirm("确认开卡【" + $('#cardName').val()
										+ "】, 优惠价" + $('#realCost').val()
										+ "元？", function() {
									form.submit();
								});//confirm
							},
							focusInvalid : false,
							rules : {
								productDiscount : {
									required : true,
									number : true,
									min : 1,
									max : 100,
								},
								realCost : {
									ifMoney : '#realCost',
									required : true,
									number : true,
									min : 1,
									max : 1000000,
								}
							},
							errorContainer : "#messageBox",
							errorPlacement : function(error, element) {
								$("#messageBox").text("输入有误，请先更正。");
								if (element.is(":checkbox")
										|| element.is(":radio")) {
									error.appendTo(element.parent().parent());
								} else {
									error.insertAfter(element);
								}
							},
							messages : {}
						});//validate
				disableExitMenu();
			});
	function page(n, s) {
		$("#pageNo").val(n);
		$("#pageSize").val(s);
		$("#searchForm").submit();
		return false;
	}
</script>
</head>
<body>
	<div class="container">
		<tags:message content="${message}" />
		<div class="icon-buttons">
			<input type="button" data-inline="true" data-icon="back"
				onclick="return directOpenURL('${ctx}/cash/member/cards/new/cardProductPage')"
				data-iconpos="notext" value="返回" />
		</div>
		<form:form method="post" id="inputForm"
			action="${ctx}/cash/member/cards/new/cardProduct"
			modelAttribute="cardForm">

			<form:hidden path="memberID" />
			<form:hidden path="templateID" />
			<div data-role="fieldcontain">
				<label>服务专员:</label> <select id="employeeID" name="employeeID">
					<c:forEach var="e" items="${member.employees}">
						<option value="${e.id}"
							${e.id==member.newCards.employee.id?'selected':''}>${e.name}</option>
					</c:forEach>
				</select>
			</div>
			<div data-role="fieldcontain">
				<label>卡名</label>
				<form:input type="text" readonly="true" path="cardName" />
			</div>
			<div data-role="fieldcontain">
				<label>产品折扣(%)</label>
				<form:input type="text" readonly="true" path="productDiscount" />
			</div>
			<div data-role="fieldcontain">
				<label>适用产品</label>
				<ul id="productList" data-role="listview" data-inset="true"	data-split-theme="a">
					<c:forEach var="pro" items="${cardForm.products}">
						<li data-inline="true">${pro}</li>
					</c:forEach>
				</ul>
			</div>

			<div data-role="fieldcontain">
				<label>零售价(元)</label>
				<form:input type="text" path="retailPrice" readonly="true" />
			</div>
			<div data-role="fieldcontain">
				<label>店面优惠价(元)</label>
				<form:input path="realCost" />
			</div>
			<div id="okbutton">
				<input type="submit" data-inline="true" value="确认开卡" />
			</div>
		</form:form>
	</div>
</body>
</html>
